<template>
    <a-modal v-model="addPop" width="70%" :title="title" centered @cancel="closePop" @ok="SubmitFn" :maskClosable="false" destroyOnClose>
        <a-form-model :model="form" ref="ruleForm" :rules="rules" :label-col="labelCol" :wrapper-col="wrapperCol" :colon="false">
            <a-row>
                <a-col :span="12">
                    <a-form-model-item label="用户名" prop="username">
                        <a-input v-model="form.username" autocomplete placeholder="请输入账号"/>
                    </a-form-model-item>
                </a-col>
                <a-col :span="12" v-if="title == '新增用户'">
                    <a-form-model-item label="密码" prop="password">
                        <a-input-password v-model="form.password" autocomplete placeholder="请输入账号密码"/>
                    </a-form-model-item>
                </a-col>
                <a-col :span="12">
                    <a-form-model-item label="姓名" prop="nickname">
                        <a-input v-model="form.nickname" placeholder="请输入人员姓名"/>
                    </a-form-model-item>
                </a-col>
                <a-col :span="12">
                    <a-form-model-item label="电话">
                        <a-input v-model="form.phone" placeholder="请输入电话号码" />
                    </a-form-model-item>
                </a-col>
                <a-col :span="12">
                    <a-form-model-item label="职位" prop="positionObj">
                        <a-select v-model="form.positionObj" placeholder="请选择职位名称" labelInValue>
                            <a-select-option :value="v.id" v-for="v in positionData" :key="v.id">
                                {{v.name}}
                            </a-select-option>
                        </a-select>
                    </a-form-model-item>
                </a-col>
                <a-col :span="12">
                    <a-form-model-item label="性别">
                        <a-select v-model="form.sex" placeholder="请选择性别">
                            <a-select-option :value="0">男</a-select-option>
                            <a-select-option :value="1">女</a-select-option>
                        </a-select>
                    </a-form-model-item>
                </a-col>
                <a-col :span="12">
                    <a-form-model-item label="身份证号" placeholder="请输入电话号码">
                        <a-input v-model="form.idCard" placeholder="请输入身份证号码"/>
                    </a-form-model-item>
                </a-col>
                <a-col :span="12">
                    <a-form-model-item label="证书">
                        <a-input v-model="form.certificate" placeholder="请输入证书"/>
                    </a-form-model-item>
                </a-col>
                <a-col :span="12">
                    <a-form-model-item label="入职时间">
                        <a-date-picker v-model="form.entryTime" placeholder="请选择入职时间" style="width:100%"/>
                    </a-form-model-item>
                </a-col>
              <a-col :span="12">
                <a-form-model-item label="是否业主">
                  <a-switch v-model="form.isOwner" />
                </a-form-model-item>
              </a-col>
            </a-row>
        </a-form-model>
<!--        <template slot="footer">-->
<!--            <a-button type="primary" @click="SubmitFn">确定</a-button>-->
<!--        </template>-->
    </a-modal>
</template>

<script>
    import { TreeSelect } from "ant-design-vue";
    const SHOW_ALL = TreeSelect.SHOW_ALL;
    import md5 from "js-md5";
    import moment from 'moment';
    export default {
        name: "UserPop.vue",
        props:{
            title:{
                required:true,
                type:String,
                default:"新增用户"
            },
            deptId:{
                required:true,
                type:[String,Number]
            }
        },
        data(){
            return{
                SHOW_ALL,
                moment,
                labelCol: { span: 4 },
                wrapperCol: { span: 16 },
                positionData:[], // 职位下拉
                addPop: false,
                form: {
                    // 弹窗添加表单数据
                    username: "",
                    password: "",
                    sex: 0,
                    nickname: "",  // 账户名
                    phone: "",  //  电话
                    deptId: "",  // 部门
                    idCard:"",  //  身份证
                    position:"",
                    positionId:"",   //职位id
                    positionObj:"",
                    entryTime:moment(),  //入职时间
                    certificate:"",  //证书
                    isOwner:false,  // 是否业主
                    level:''
                },
                rules: {
                    username: [
                        {
                            required: true,
                            message: "用户名必填",
                            trigger: "blue",
                        },
                    ],
                    password: [
                        { required: true, message: "密码必填", trigger: "blue" },
                    ],
                    nickname:[
                        {required:true,message:"姓名必填",trigger:"blue"}
                    ],
                    positionObj:[
                        {required:true,message:"职位必选",trigger:"blue"}
                    ]
                },
            }
        },
        methods:{
            // 新增用户确定
            SubmitFn() {
                // 弹窗提交按钮-
                this.$refs.ruleForm.validate((err) => {
                    if (err) {
                        if(!this.form.deptId||this.form.deptId == ""){
                            this.$message.info("未选取运维点")
                        }
                        let obj = JSON.parse(JSON.stringify(this.form));
                        obj.position = obj.positionObj.label;
                        obj.positionId = obj.positionObj.key;
                        obj.entryTime = new Date(obj.entryTime).getTime()
                        if (this.title == "新增用户") {
                            if (obj.password != null) {
                                obj.password = md5(obj.password);
                            }
                            console.log(obj)
                            this.$api.addUser(obj).then((res) => {
                                if (res.data.code == 0) {
                                    this.$message.info("添加成功!");
                                    this.addPop = false;
                                    this.$emit("heavyLoad");
                                    this.form = {
                                        // 弹窗添加表单数据
                                        username: "",
                                        password: "",
                                        sex: 0,
                                        nickname: "",  // 账户名
                                        phone: "",  //  电话
                                        deptId: "",  // 部门
                                        idCard:"",  //  身份证
                                        positionId:undefined,   //职位id
                                        entryTime:moment(),  //入职时间
                                        certificate:"",  //证书
                                    };
                                } else {
                                    this.$message.warning(res.data.errorMessage);
                                }
                            });
                        } else {
                            // console.log(obj)
                          if(obj.password){
                            delete obj.password
                          }
                            this.$api.editUser(obj).then((res) => {
                                if (res.data.code == 0) {
                                    this.form = {
                                        // 弹窗添加表单数据
                                        username: "",
                                        password: "",
                                        sex: 0,
                                        nickname: "",  // 账户名
                                        phone: "",  //  电话
                                        deptId: "",  // 部门
                                        idCard:"",  //  身份证
                                        positionId:undefined,   //职位id
                                        entryTime:moment(),  //入职时间
                                        certificate:"",  //证书
                                    };
                                    this.$emit("heavyLoad");
                                    this.addPop = false;
                                    this.$message.info("修改成功!");
                                } else {
                                    this.$message.warning(res.data.errorMessage);
                                }
                            });
                        }
                    }
                });
            },
            closePop(){
                this.form = {
                    // 弹窗添加表单数据
                    username: "",
                    password: "",
                    sex: 0,
                    nickname: "",  // 账户名
                    phone: "",  //  电话
                    deptId: "",  // 部门
                    idCard:"",  //  身份证
                    positionId:undefined,   //职位id
                    entryTime:moment(),  //入职时间
                    certificate:"",  //证书
                }
            },
            // 数据获取方法
            getTreeData() {
                this.$api.getDictionaryList({current:"1", size:"1000", id:"1325979029088788481"}).then(res=>{
                    if(res.data.code == 0){
                        this.positionData = res.data.data;
                    }else{
                        this.$message.warning(res.data.errorMessage)
                    }
                    console.log(res.data)
                })
            },
            // 对获取到的数据进行递归处理
            setTreeData(source) {
                let cloneData = JSON.parse(JSON.stringify(source)); // 对源数据深度克隆
                return cloneData.filter((father) => {
                    father.scopedSlots = { title: "custom" };
                    let Arr = cloneData.filter(
                        (child) => father.id == child.parentId
                    );
                    Arr.length > 0 ? (father.children = Arr) : ""; //给父级添加一个children属性，并赋值
                    return father.parentId == -1; //返回第一层
                });
            },
        },
        mounted() {

        },
        watch:{
            deptId:{
                handler(newvalue){
                    this.form.deptId = newvalue;
                }
            }
        }
    }
</script>

<style scoped>

</style>